import QtQuick

import "qrc:/usv_bridge/UI/compass/"


Rectangle {
    id: speed
    width: 327
    color:"#F7F7F7"

    radius: 5
    //第一行
    Text{
        id: depth_title
        text: qsTr("深度信息")
        font.family: ("Noto Sans")
        font.pixelSize: 16
        color: "#0070D6"
        anchors{
            top: parent.top
            topMargin: 10
            horizontalCenter: speed.horizontalCenter
        }
    }

    Image{
        id: depth
        anchors{
            left: parent.left
            leftMargin: 30
            top: depth_title.bottom
            topMargin: 0
        }
        source:"qrc:/usv_bridge/UI/compass/Depth.png"
    }

    Text{
        //system controller var
        id: depth_value_zero
        text: qsTr("0")
        font.family: ("Noto Sans")
        font.pixelSize: 36
        color: Qt.rgba(0, 0, 0, 0.08)
        anchors{
            left: parent.left
            leftMargin: 103
            verticalCenter: depth.verticalCenter
        }
    }
    Text{
        //system controller var
        id: depth_value
        text: qsTr("23")
        font.family: ("Noto Sans")
        font.pixelSize: 36
        color: "#325B9A"
        anchors{
            top: depth_value_zero.top
            left: depth_value_zero.right
        }
    }

    // 描述
    Text{
        //system controller var
        id: depth_unit
        text: qsTr("Depth")
        font.family: ("Noto Sans")
        font.pixelSize: 16
        color: "#666666"
        anchors{
            left: depth_value.right
            leftMargin: 16
            top: depth_value.top
            topMargin: 5
        }
    }
    // 描述2
    Text{
        //system controller var
        id: depth_meter
        text: qsTr("m")
        font.family: ("Noto Sans")
        font.pixelSize: 12
        color: "#666666"
        anchors{
            left: depth_unit.left
            top: depth_unit.bottom
        }
    }

    //竖直分割线
    Rectangle{
        id: right_split_line
        width: 1
        height: 28
        color: Qt.rgba(0, 0, 0, 0.08)
        anchors{
            left: parent.left
            leftMargin: 250
            verticalCenter: depth_value.verticalCenter
        }
    }

    Text{
        //system controller var
        text: qsTr("SRC")
        font.family: ("Noto Sans")
        font.pixelSize: 16
        color: "#666666"
        anchors{
            left: right_split_line.right
            leftMargin: 10
            verticalCenter: depth_value.verticalCenter
        }
    }

}
